<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <title>筛子作业</title>
    <link rel="stylesheet" href="../../common/reset.css">
    <link rel="stylesheet" href="./筛子.css">
</head>

<body>
    <div class="BigBox">
        <!-- 1点 -->
        <div class="sieve">
            <div class="point" style="background-color: red;"></div>
        </div>

        <!-- 2点 -->
        <div class="sieve2">
            <div class="point"></div>
            <div class="point"></div>
        </div>

        <!-- 3点 -->
        <div class="sieve3">
            <div class="point1"></div>
            <div class="point"></div>
            <div class="point2"></div>
        </div>

        <!-- 4点 -->
        <div class="sieve3">
            <div class="point1"></div>
            <div class="point3"></div>
            <div class="point4"></div>
            <div class="point2"></div>
        </div>

        <!-- 5点 -->
        <div class="sieve3">
            <div class="point6"></div>
            <div class="point7"></div>
            <div class="point9"></div>
            <div class="point5"></div>
            <div class="point8"></div>
        </div>

        <!-- 6点 -->
        <div class="sieve4">
            <!-- 上区域 -->
            <div class="groupA">
                <div class="point"></div>
                <div class="point"></div>
                <div class="point"></div>
            </div>
            <!-- 下区域 -->
            <div class="groupB">
                <div class="point"></div>
                <div class="point"></div>
                <div class="point"></div>
            </div>
        </div>

        <!-- 7点 -->
        <div class="sieve4">
            <!-- 上区域 -->
            <div class="groupA">
                <div class="point"></div>
                <div class="point"></div>
                <div class="point"></div>
            </div>
            <div class="point10"></div>
            <!-- 下区域 -->
            <div class="groupB">
                <div class="point"></div>
                <div class="point"></div>
                <div class="point"></div>
            </div>
        </div>

        <!-- 8点 -->
        <div class="sieve4">
            <!-- 上区域 -->
            <div class="groupA">
                <div class="point"></div>
                <div class="point"></div>
                <div class="point"></div>
            </div>
            <div class="point11"></div>
            <div class="point12"></div>
            <!-- 下区域 -->
            <div class="groupB">
                <div class="point"></div>
                <div class="point"></div>
                <div class="point"></div>
            </div>
        </div>
    </div>
</body>

</html>